//定义一些通用样式
// icon样式，覆盖iconfont.cn
.iconfont {
  display: flex;
  flex-flow: row;
  align-items: center;
  line-height: 1;
}
/*默认页面背景色*/
.bgc-default{
  background-color: #F7F8FA;
}
/*页面黑色背景颜色*/
.bgc-black{
  background-color: #000;
}
// 白色背景
.bgc-white {
  background-color: #fff;
}
.bgc-dark-blue {
  background-color: #182245;
}
/*字体加粗*/
.font-w {
  font-weight: bold;
}
.font-normal {
  font-weight: normal;
}

/*
默认颜色
font-color 默认 #333
*/

.font-color {
  color: #333;
}

.font-color-6 {
  color: #666;
}

.font-color-9 {
  color: #999;
}

.font-color-2c {
  color: #2C2C2C;
}


/*颜色*/
.font-black {
  color: #373737;
}

.font-white {
  color: #fff;
}

.font-gray {
  color: gray;
}

.font-pink {
  color: #fa606c;
}

.font-red {
  color: #FE2408;
}

.font-red-16 {
  color: #F91616;
}

.font-red-1D {
  color: #D61D1D;
}

.font-price {
  color: #F4525B;
}

.font-price-2d {
  color: #FF2D2D;
}

.font-price-00B {
  color: #FF500B;
}

.font-number {
  color: #FF4040;
}

.font-link-red {
  color: #FF1414;
}

.font-orange {
  color: #eb6700
}

.font-current-page {
  color: #FF1C1C;
}

.font-orange-2{
  color: #ff8829;
}

.font-green {
  color: #00b200;
}

.font-yellow {
  color: #f8c400;
}

.font-blue {
  color: #3187fd;
}

.font-blue-3FF {
  color: #0083FF;
}

.font-dark-blue {
  color: #182245;
}

.big-title {
  font-size: 25px;
  font-weight: bold;
}

.small-title {
  font-size: 18px;
  font-weight: bold;
}

.main-text {
  font-size: 15px;
}

.other-text {
  font-size: 13px;
}

// 斜体
.font-italic {
  font-style: italic
}

// 下滑线
.font-under {
  text-decoration: underline;
}

.text-c {
  text-align: center;
}

.text-l {
  text-align: left;
}

.text-r {
  text-align: right;
}

.text-del {
  text-decoration: line-through;
}

/*边框*/
.border-none {
  border: 0;
}
.border-none:before {
  border: 0;
}
.border-none:after {
  border: 0;
}

.border-d7 {
  border: 1px solid #d7d7d7;
}

.border-all {
  border: 1px solid #ebeef5;
}

.border-t {
  border-top: 1px solid #ebeef5;
}

.border-b {
  border-bottom: 1px solid #ebeef5;
}

.border-l {
  border-left: 1px solid #ebeef5;
}

.border-r {
  border-right: 1px solid #ebeef5;
}

.overflow-h {
  overflow: hidden;
}

// 盒模型
.box-border{
  box-sizing: border-box;
}

/*布局*/
.inline-flex {
  display: inline-flex;
  align-items: center;
}

.flex {
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
}

.flex-item {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  flex: 1;
}
/* 横版 向两边靠*/
.flex-between{
  justify-content: space-between;
  align-items: center;
}
/* 横向 居中*/
.flex-center{
  justify-content: center;
  align-items: center;
}
.flex-baseline {
  align-items: baseline;
}
/*竖版 每行2个*/
.flex-wrap-2 {
  display: flex;
  flex-wrap: wrap;
}

/*换行*/
.flex-wrap {
  flex-wrap: wrap;
}

/*横版*/
.flex-row {
  display: flex;
  flex-flow: row;
}

/*竖版*/
.flex-col {
  display: flex;
  flex-flow: column;
}

/*横向居左*/
.align-l {
  display: flex;
  flex-flow: column;
  align-items: flex-start;
}

/*横向居中*/
.align-c {
  display: flex;
  flex-flow: column;
  align-items: center;
}

/*垂直居中*/
.v-align-c {
  display: flex;
  flex-flow: row;
  align-items: center;
}

/*垂直底部*/
.v-align-b {
  display: flex;
  flex-flow: row;
  align-items: flex-end;
}

/*垂直头部*/
.v-align-t {
  display: flex;
  flex-flow: row;
  align-items: flex-start;
}

/*右对齐*/
.align-r {
  display: flex;
  flex-flow: row;
  justify-content: flex-end;
}

/*文字排版*/

.text-align-c {
  text-align: center;
}

.text-align-l {
  text-align: left;
}

.text-align-r {
  text-align: right;
}

.text-del {
  text-decoration: line-through;
}

// 宽度100%
.width-per-100 {
  width: 100%
}

.width-per-90 {
  width: 90%
}

.width-per-95 {
  width: 95%
}

.width-per-80 {
  width: 80%
}

.width-per-70 {
  width: 70%
}

.width-per-60 {
  width: 60%
}

.width-per-50 {
  width: 50%
}

.width-per-40 {
  width: 40%
}

.width-per-35{
  width: 35%
}

.width-per-30 {
  width: 30%
}

.width-per-20 {
  width: 20%
}

.width-per-10 {
  width: 10%
}

//高度100%
.height-per-100 {
  height: 100%
}

// 白色背景
.bg-color-white {
  background-color: #fff;
}

// 浮在右边
.float-r {
  float: right;
}

// 浮在左边
.float-l {
  float: left;
}

// 绝对位置：右
.abs-right {
  position: absolute;
  right: 0;
}

// 相对位置
.position-r{
  position: relative;
}

// 隐藏
.hidden {
  display: none;
}

// 阴影
.box-shadow {
  box-shadow: 2px 2px 5px #d9d9d9;
}

// 圆角
.border-radius-10 {
  border-radius: 10px;
}
.border-radius-8 {
  border-radius: 8px;
}
.border-radius-6 {
  border-radius: 6px;
}
.border-radius-5 {
  border-radius: 5px;
}
.border-radius-4 {
  border-radius: 4px;
}
.border-radius-2 {
  border-radius: 2px;
}
.border-radius-0 {
  border-radius: 0px;
}

/* 鼠标样式 */
.cursor-p {
  cursor: pointer;
}

.cursor-m {
  cursor: move;
}

/* icon 样式的 button */
.button-icon {
  border-radius: 0;
  padding: 0;
  margin: 0;
  background: none;
}
.button-icon:after {
  border: none;
}

.mini-btn {
  background-color: #f8c400;
  border-radius: 20px;
  font-size: 12px;
  border: none;
}
.mini-btn:after {
  border: none;
}

/* container背景清除 */
.container-bg-none{
  background-color: none;
  box-shadow: 0 0 0;
  border: none;
}

/* x文字样式定义 */
.font-x{
  font-family: 'Arial Normal', 'Arial';
  font-weight: 400;
  font-style: normal;
}

/* x文字样式定义 */
.font-normal{
  font-weight: normal;
}

// 滚动条样式
.vb > .vb-dragger {
  z-index: 5;
  width: 10px;
  right: 0;
}
.vb > .vb-dragger > .vb-dragger-styler {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transform: rotate3d(0,0,0,0);
  transform: rotate3d(0,0,0,0);
  -webkit-transition:
    background-color 100ms ease-out,
    margin 100ms ease-out,
    height 100ms ease-out;
  transition:
    background-color 100ms ease-out,
    margin 100ms ease-out,
    height 100ms ease-out;
  background-color: #e4e4e4;
  margin: 5px 5px 5px 0;
  border-radius: 20px;
  height: calc(100% - 10px);
  display: block;
}

.vb.vb-scrolling-phantom > .vb-dragger > .vb-dragger-styler {
  background-color: #c1c1c1;
}

.vb > .vb-dragger:hover > .vb-dragger-styler {
  background-color: #c1c1c1;
  margin: 0px;
  height: 100%;
}

.vb.vb-dragging > .vb-dragger > .vb-dragger-styler {
  background-color: #f1f1f1;
  margin: 0px;
  height: 100%;
}

.vb.vb-dragging-phantom > .vb-dragger > .vb-dragger-styler {
  background-color: #c1c1c1;
}

// 2行文字展示
.line-2{
  /*! autoprefixer: off */
  line-height: 1.4;
  overflow:hidden;
  text-overflow:ellipsis;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  word-break:break-word;
}
.line-1{
  /*! autoprefixer: off */
  line-height: 1.4;
  overflow:hidden;
  text-overflow:ellipsis;
  display:-webkit-box;
  -webkit-line-clamp:1;
  -webkit-box-orient:vertical;
  word-break:break-word;
}

.pos-rel{
  position: relative;
}

.clear-both {
  clear: both;
}

.container-width{
  width: 1400px;
  margin: 0 auto;
}

// 分页样式重新定义
.el-pagination.is-background.pagination {
  .el-pager li{
    background-color: #ffffff;
    color: #666666;
    border: #e5e5e5 1px solid;
    border-radius: 4px;
    font-weight: normal;
    font-size: 14px;
    &:hover{
      color: #666666;
    }
    &:focus{
      color: #666666;
    }
  }
  .el-pager li.active{
    border: #182245 1px solid;
    background-color: #182245;
    color: #fff;
  }
  .el-pagination__jump .el-input__inner{
    border: #e5e5e5 1px solid;
    &:hover{
      border: #e5e5e5 1px solid;
    }
    &:focus{
      border: #e5e5e5 1px solid;
    }
  }
}

// 下拉联机选择样式重新定义
.popper-layer{
  .el-cascader-node.is-active{
    color: #182245;
  }
}

// 表格样式重新定义
.c-table{
  overflow: auto;
  min-height: 200px;
  &.buy-table{
    .c-table__container{      
      .c-table__tr{
        &:last-child{
          border-bottom: none;
        }
      }
    }
  }
  .c-table__td{
    // width: 215px;
    // flex: 1;
    padding: 0 15px;
    flex-shrink: 0;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
  }
  .c-table__head{
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 50px;
    background:#f9f9f9;
    color: #333333;
    border: #f5f5f5 1px solid;
    .goods-info{
      width: 300px;
    }
    .select{
      width: 50px;
      flex: unset;
    }
    .text-align-r{
      justify-content: flex-end;
    }
  }
  .c-table__body{
    // width: fit-content;
    .c-table__row{
      &:last-child{
        .c-table__tr{
          border-bottom: none;
        }
      }
      .c-row__head{
        display: flex;
        align-items: center;
        justify-content: space-between;
        height: 34px;
        background-color: #f5f7fb;
        margin-top: 20px;
        padding-right: 15px;
      }
      .c-row__footer{
        background-color: #f5f7fb;
      }
      .c-row__left{
        display: flex;
        align-items: center;
        justify-content: left;
        position: relative;
        font-size: 12px;
        img{
          border-radius: 50%;
        }
      }
      .c-table__tr{
        display: flex;
        align-items: center;
        justify-content: space-between;
        border-bottom: 1px solid #edeff6;
        min-height: 50px;
        &:hover{
          background-color: #f5f7fb;
          cursor: pointer;
          .text-align-r{
            background-color: #f5f7fb;
          }
        }
        // &:first-child{
        //   &:hover{
        //     background-color: unset;
        //   }
        // }
        .goods-info{
          width: 300px;
        }
        .select{
          width: 50px;
          flex: unset;
        }
      }
    }
  }
  .checkbox-pad{
    margin-right: 10px!important;
    font-size: 16px;
  }
  .align-td-t{
    align-items: flex-start!important;
    .c-table__td{
      padding-top: 17px!important;
      padding-bottom: 20px!important;
    }
  }
}

// dialog样式重新定义
.el-dialog__header{
  border-bottom: #f5f6fa 1px solid;
  padding-top: 12px;
  .el-dialog__title{
    font-size: 16px;    
  }
}
.el-dialog__headerbtn{
  margin-top: -5px;
}
.el-dialog__close{  
  &.el-icon{
    font-size: 20px;
    color: #cccccc;
    &:hover{
      color: #182245;
    }
  }
}
.dialog-footer{
  .dialog-sure{
    background: #182245;
    color: #fff;
    border: #182245 1px solid;
    min-height: 30px;
    padding: 0px 15px;
  }
  .dialog-close{
    background: #ffffff;
    color: #182245;
    border: #182245 1px solid;
    min-height: 30px;
    padding: 0px 15px;
  }
}

// message-box样式重新定义
.el-message-box__close{
  font-size: 20px;
  color: #cccccc!important;
  &:hover{
    color: #182245!important;
  }
}
.el-message-box__btns{
  .el-button--default{
    background: #ffffff;
    color: #182245;
    border: #182245 1px solid;
    min-height: 30px;
    padding: 0px 15px;
  }
  .el-button--primary{
    background: #182245;
    color: #fff;
    border: #182245 1px solid;
    min-height: 30px;
    padding: 0px 15px;
  }
}

// 下拉菜单重新定义样式
.el-menu--horizontal .el-menu .el-menu-item:hover{
  background: #e3e3e3 !important;
}
.el-menu--horizontal .el-menu.el-menu--popup{
  padding: 0px 0;
}

// 跨境标识样式定义
.cross-border-tag{
  padding: 1px 3px 1px 4px;
  font-size: 12px;
  font-weight: normal;
  display: inline-block;
  &.tag-1{
    background: #9e51ed;
    color: #ffffff;
  }
}

// 支付结果层样式定义
.dialog-result{
  .el-dialog__header{
    display: none;
  }
}